<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>教师界面</title>
    <link rel="stylesheet" href="../css/style.css">
    <style type="text/css">
        span{
            position: absolute;
            right: 10px;
            top: 10px;
        }
    </style>
</head>
<script type="text/javascript" src="/education/js/jquery-3.2.1.js"></script>

<script type="text/javascript">

    $(function () {
        //var urlParams = new URLSearchParams(window.location.search);
        //var name = urlParams.get("")

        //点击个人信息
        showPersonalInfo = function () {
            $("#mainContent").empty();
            var url = "/education/selectInfo.teacher";
            $.post(url, function (data) {
                var params = JSON.parse(data);
                const content = `
        <h2>个人信息</h2>
        <form id="personalInfoForm">
            <div class="form-group">
                <label>教师编号：</label>
                <input type="text" id="id" readonly>
            </div>
            <div class="form-group">
                <label>姓名：</label>
                <input type="text" id="name">
            </div>
            <div class="form-group">
                <label>密码：</label>
                <input type="text" id="password">
            </div>
            <div class="form-group">
                <label>课程：</label>
                <input type="text" id="course">
            </div>
            <div class="form-group">
                <label>性别：</label>
                <input type="text" id="sex">
            </div>
            <div class="form-group">
                <label>电话：</label>
                <input type="text" id="phone">
            </div>
            <button type="submit">保存修改</button>
        </form>
    `;

                document.getElementById('mainContent').innerHTML = content;
                $("#id").prop("value", params.teacherId);
                $("#name").prop("value", params.teacherName);
                $("#password").prop("value", params.teacherPassword);
                $("#course").prop("value", params.teacherCourse);
                $("#sex").prop("value", params.teacherSex);
                $("#phone").prop("value", params.teacherPhone);


            })
        }
//点击成绩管理
        showGradeManagement = function () {
            $("#mainContent").empty();
            const content2 = `<div id="contexttop">
        <table id="tab" border="1">
            <tr>
                <td colspan="7" height="50px">
                    <h3>学生信息管理</h3>
                </td>
            </tr>
            <tr bgcolor="#E0FBC4">
                <th>学生编号</th>
                <th>学生姓名</th>
                <th>学生性别</th>
                <th>电话号码</th>
                <th>年龄</th>
                <th>家庭住址</th>
                <th>操作</th>
            </tr>
            <tbody id="tabledata"></tbody>
        </table>
    </div>
    <div align="center" id="contextbottom">
        总记录数：<span id="recordCount"></span> 条
        共 <span id="totalPages"></span> 页
        <a href="#" id="firstPage">首页</a>
        <a href="#" id="prevPage">上一页</a>
        <a href="#" id="nextPage">下一页</a>
        <a href="#" id="lastPage">尾页</a>
        当前第 <span id="currentPage"></span> 页
    </div>`;

            $("#mainContent").html(content2);
            loadStudentData(1);
        }


        function loadStudentData(page) {
            $.ajax({
                url: "/education/selectByPage.teacher",
                type: "POST",
                data: {page: page},
                dataType: "json",
                success: function (response) {
                    if (response.error) {
                        alert(response.error);
                        return;
                    }

                    // 清空表格数据
                    $("#tabledata").empty();

                    // 填充学生数据
                    response.data.forEach(function (student) {
                        let row = `
                    <tr>
                        <td>${student.sid}</td>
                        <td>${student.sname || ''}</td>
                        <td>${student.ssex || ''}</td>
                        <td>${student.sphone || ''}</td>
                        <td>${student.sage || ''}</td>
                        <td>${student.sadress || ''}</td>
                        <td>
                            <button onclick="editStudent(${student.sid})">编辑</button>
                            <button onclick="deleteStudent(${student.sid})">删除</button>
                        </td>
                    </tr>
                `;
                        $("#tabledata").append(row);
                    });

                    // 更新分页信息
                    $("#recordCount").text(response.totalRecords);
                    $("#totalPages").text(response.totalPages);
                    $("#currentPage").text(response.currentPage);

                    // 绑定分页按钮事件
                    $("#firstPage").off().on("click", function (e) {
                        e.preventDefault();
                        if (response.currentPage > 1) loadStudentData(1);
                    });

                    $("#prevPage").off().on("click", function (e) {
                        e.preventDefault();
                        if (response.currentPage > 1) loadStudentData(response.currentPage - 1);
                    });

                    $("#nextPage").off().on("click", function (e) {
                        e.preventDefault();
                        if (response.currentPage < response.totalPages) loadStudentData(response.currentPage + 1);
                    });

                    $("#lastPage").off().on("click", function (e) {
                        e.preventDefault();
                        if (response.currentPage < response.totalPages) loadStudentData(response.totalPages);
                    });
                },
                error: function (xhr, status, error) {
                    alert("加载数据失败：" + error);
                }
            });
        };
        //
        $(document).ready(function() {
            $("#editForm").on("submit", function(e) {
                e.preventDefault();

                // 收集表单数据
                var studentData = {
                    sid: $("#editSid").val(),
                    sname: $("#editName").val(),
                    ssex: $("#editSex").val(),
                    sphone: $("#editPhone").val(),
                    sage: $("#editAge").val(),
                    sadress: $("#editAddress").val()
                };

                // 发送更新请求
                $.ajax({
                    url: "/education/updateStudent.teacher",
                    type: "POST",
                    data: studentData,
                    dataType: "json",
                    success: function(response) {
                        if (response.success) {
                            alert("更新成功！");
                            closeModal();
                            // 重新加载当前页数据
                            loadStudentData($("#currentPage").text());
                        } else {
                            alert("更新失败：" + response.error);
                        }
                    },
                    error: function(xhr, status, error) {
                        alert("更新失败：" + error);
                    }
                });
            });

            // 点击模态框外部关闭
            $(window).click(function(e) {
                if ($(e.target).is("#editModal")) {
                    closeModal();
                }
            });
        });

    })
</script>
<script>
    function deleteStudent(sid){
        if (confirm("确定要删除这条记录吗？")) {
            $.ajax({
                url: "/education/deleteStudent.teacher",
                type: "POST",
                data: { sid: sid },
                dataType: "json",
                success: function(response) {
                    if (response.success) {
                        alert("删除成功！");
                        // 重新加载当前页数据
                        loadStudentData($("#currentPage").text());
                    } else {
                        alert("删除失败：" + response.error);
                    }
                },
                error: function(xhr, status, error) {
                    alert("删除失败：" + error);
                }
            });
        }
    }
</script>
<body>
    <nav class="nav-bar">
        <ul>
            <li><a href="#" onclick="showPersonalInfo()">个人信息</a></li>
            <li><a href="#" onclick="showGradeManagement()">学生管理</a></li>
            <li><a href="#" onclick="showSchedule()">课表查看</a></li>
            <li><a href="../index.html">退出登录</a></li>
        </ul>
       <!-- <span>[<span id="fullname"></span>] : 欢迎登录教师系统</span>-->
        <span>欢迎登录教师系统</span>
    </nav>

    <div class="main-content" id="mainContent">
        <!-- 内容将通过JavaScript动态加载 -->


    </div>
    <script src="../js/teacher.js"></script>
    <div id="editModal" class="modal" style="display: none;">
        <div class="modal-content">
            <span class="close">&times;</span>
            <h2>编辑学生信息</h2>
            <form id="editForm">
                <input type="hidden" id="editSid">
                <div class="form-group">
                    <label>姓名：</label>
                    <input type="text" id="editName">
                </div>
                <div class="form-group">
                    <label>性别：</label>
                    <select id="editSex">
                        <option value="男">男</option>
                        <option value="女">女</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>电话：</label>
                    <input type="text" id="editPhone">
                </div>
                <div class="form-group">
                    <label>年龄：</label>
                    <input type="number" id="editAge">
                </div>
                <div class="form-group">
                    <label>地址：</label>
                    <input type="text" id="editAddress">
                </div>
                <div class="form-buttons">
                    <button type="submit">保存</button>
                    <button type="button" onclick="closeModal()">取消</button>
                </div>
            </form>
        </div>
    </div>
</body>
</html>

<script type="text/javascript">
    function editStudent(sid) {
        // 获取学生信息
        $.ajax({
            url: "/education/getStudent.teacher",
            type: "POST",
            data: { sid: sid },
            dataType: "json",
            success: function(student) {
                // 填充表单
                $("#editSid").val(student.sid);
                $("#editName").val(student.sname);
                $("#editSex").val(student.ssex);
                $("#editPhone").val(student.sphone);
                $("#editAge").val(student.sage);
                $("#editAddress").val(student.sadress);

                // 显示模态框
                $("#editModal").show();
            },
            error: function(xhr, status, error) {
                alert("获取学生信息失败：" + error);
            }
        });
    }

    /*function deleteStudent(sid) {
        if (confirm("确定要删除这条记录吗？")) {
            $.ajax({
                url: "/education/deleteStudent.teacher",
                type: "POST",
                data: { sid: sid },
                dataType: "json",
                success: function(response) {
                    if (response.success) {
                        alert("删除成功！");
                        // 重新加载当前页数据
                        loadStudentData($("#currentPage").text());
                    } else {
                        alert("删除失败：" + response.error);
                    }
                },
                error: function(xhr, status, error) {
                    alert("删除失败：" + error);
                }
            });
        }
    }*/
    function closeModal() {
        $("#editModal").hide();
    }

    // $(document).ready(function() {
    //     $("#editForm").on("submit", function(e) {
    //         e.preventDefault();
    //
    //         // 收集表单数据
    //         var studentData = {
    //             sid: $("#editSid").val(),
    //             sname: $("#editName").val(),
    //             ssex: $("#editSex").val(),
    //             sphone: $("#editPhone").val(),
    //             sage: $("#editAge").val(),
    //             sadress: $("#editAddress").val()
    //         };
    //
    //         // 发送更新请求
    //         $.ajax({
    //             url: "/education/updateStudent.teacher",
    //             type: "POST",
    //             data: studentData,
    //             dataType: "json",
    //             success: function(response) {
    //                 if (response.success) {
    //                     alert("更新成功！");
    //                     closeModal();
    //                     // 重新加载当前页数据
    //                     loadStudentData($("#currentPage").text());
    //                 } else {
    //                     alert("更新失败：" + response.error);
    //                 }
    //             },
    //             error: function(xhr, status, error) {
    //                 alert("更新失败：" + error);
    //             }
    //         });
    //     });
    //
    //     // 点击模态框外部关闭
    //     $(window).click(function(e) {
    //         if ($(e.target).is("#editModal")) {
    //             closeModal();
    //         }
    //     });
    // });
</script>